<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--民宿分页--%>
<!DOCTYPE html>

<html>

<head>
    <title>民宿</title>
    <link href="/myhouse/static/web/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
    <!-- jQuery (necessary for Bootstrap's Java- plugins) -->
    <script src="/myhouse/static/web/js/jquery.min.js"></script>
    <!-- Custom Theme files -->
    <!--menu-->
    <script src="/myhouse/static/web/js/scripts.js"></script>
    <link href="/myhouse/static/web/css/styles.css" rel="stylesheet">
    <!--//menu-->
    <!--theme-style-->
    <link href="/myhouse/static/web/css/style.css" rel="stylesheet" type="text/css" media="all" />
    <!--//theme-style-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="Real Home Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
    <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>

</head>
<body>
<script src="/myhouse/static/web/js/easyResponsiveTabs.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#horizontalTab').easyResponsiveTabs({

            type: 'default', //Types: default, vertical, accordion

            width: 'auto', //auto or any width like 600px

            fit: true   // 100% fit in a container

        });

    });

</script>
<!--header-->
<jsp:include page="/inc/head.jsp"></jsp:include>

<!--//-->

<div class=" banner-buying">

    <div class=" container">

        <h3><span>MY</span>house</h3>

        <!---->

        <jsp:include page="/inc/menu.jsp"></jsp:include>

        <div class="clearfix"> </div>

        <!--initiate accordion-->

        <script type="text/javascript">

            $(function() {
                var menu_ul = $('.menu > li > ul'),
                    menu_a  = $('.menu > li > a');
                menu_ul.hide();
                menu_a.click(function(e) {
                    e.preventDefault();
                    if(!$(this).hasClass('active')) {
                        menu_a.removeClass('active');
                        menu_ul.filter(':visible').slideUp('normal');
                        $(this).addClass('active').next().stop(true,true).slideDown('normal');
                    } else {
                        $(this).removeClass('active');
                        $(this).next().stop(true,true).slideUp('normal');
                    }
                });
            });

        </script>

    </div>

</div>
<!--//header-->
<!---->
<div class="single">
    <!---->
    <div class="container">
<%--  找不到房屋的提示语居中显示，添加返回上一级网页超链接 --%>
        <c:if test="${empty requestScope.houses}">
            <div style="display: flex;justify-content: center;align-items: center;">
                <span style="font-size: 20px;margin-top: 50px">没有找到符合条件的房屋</span><br><br>
                <span style="margin-top: 150px"><a href="/myhouse/web/blog">返回</a></span>
            </div>
        </c:if>
        <c:if test="${not empty requestScope.houses}">
            <h3>民宿</h3>
            <div class="col-md-9 single-box">
                <c:forEach items="${requestScope.houses}" var="List">
                    <div class="box-col">
                        <div class=" col-sm-7 left-side ">
                            <a href="single.jsp">
                                <div style="width: 500px; height: 300px">
                                    <img style="width: 100%; height: 100%" class="img-responsive" src="/myhouse/static/uploadImages/${List.showImg}" alt="">
                                </div>
                            </a>
                        </div>

                        <div class="col-sm-5 middle-side">
                        <%--数值后加单位--%>
                            <p><span class="bath">卧室 </span>: <span class="two">${List.room} 间</span></p>
                            <p><span class="bath">面积</span>: <span class="two">${List.area} ㎡</span></p>
                            <p><span class="bath">价格 </span>:<span class="two"> ${List.price} 元</span></p>
                            <p><span class="bath">城市 </span>:<span class="two"> ${List.city}</span></p>
                            <p><span class="bath">
									<c:if test="${List.sold == false}">
                                        已出租
                                    </c:if>
									<c:if test="${List.sold == true}">
                                        未出租
                                    </c:if>
								</span></p>
                            <div class="right-side">
                                <a href="/myhouse/web/contact?id=${List.id}&&mediatorId=${List.mediatorId}" class="hvr-sweep-to-right more" >联系我</a>
                                <a href="/myhouse/web/single?id=${List.id}" class="hvr-sweep-to-right more" >查看详情</a>
                            </div>
                        </div>
                        <div class="clearfix"> </div>
                    </div>
                </c:forEach>
                <%-- <div class="map-single">--%>
        </c:if>
            <%-- <iframe src="https://www.amap.com/" sandbox=""></iframe>--%>

            <%-- </div>--%>
            <div class="blog-list1">
            </div >
            <nav style="display: flex;justify-content: center;">
                <ul class="pagination">
                    <c:if test="${requestScope.paper.pageNO > 1}">
                        <li><a href="/myhouse/web/minsuSingle?pno=${requestScope.paper.pageNO - 1}&&city=${house.city}&&type=民宿&&room=${house.room}" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
                    </c:if>

                    <c:forEach begin="1" end="${requestScope.paper.pageCount}" var="i">
                        <li class="active"><a href="/myhouse/web/minsuSingle?pno=${i}&&city=${house.city}&&type=民宿&&room=${house.room}">${i}<span class="sr-only">(current)</span></a></li>
                    </c:forEach>

                    <c:if test="${requestScope.paper.pageNO < requestScope.paper.pageCount}">
                        <li><a href="/myhouse/web/minsuSingle?pno=${requestScope.paper.pageNO + 1}&&city=${house.city}&&type=民宿&&room=${house.room}" aria-label="Next"><span aria-hidden="true">»</span></a></li>
                    </c:if>
                </ul>
                <span style="margin-top: 25px;margin-left: 50px"><a href="/myhouse/web/hotel">返回</a></span>
            </nav>
        </div>
    </div>

</div>

<!---->
<div>

</div>
<!--footer-->
<jsp:include page="/inc/footer.jsp"></jsp:include>
<!--//footer-->

</body>

</html>
